<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title></title>

	<link href="css/mui.min.css" rel="stylesheet" />
	<link href="css/app.css" rel="stylesheet" />
</head>

<body>

	<nav class="mui-bar mui-bar-tab" id="nav">
		<a id="defaultTab" class="mui-tab-item mui-active" href="NAV-Home.html">
			<span class="mui-icon mui-icon-home"></span>
			<span class="mui-tab-label">首页</span>
		</a>
		<a class="mui-tab-item" href="NAV-News.html">
			<span class="mui-icon mui-icon-chatboxes"><span style="display: none;" class="mui-badge">1</span></span>
			<span class="mui-tab-label">新闻</span>
		</a>
		<a class="mui-tab-item" href="NAV-Phone.html">
			<span class="mui-icon mui-icon-chatboxes"><span style="display: none;" class="mui-badge">1</span></span>
			<span class="mui-tab-label">联络</span>
		</a>
		<a class="mui-tab-item" href="NAV-Myset.html">
			<span class="mui-icon mui-icon-home"></span>
			<span class="mui-tab-label">我的</span>
		</a>
	</nav>
</body>
<script src="js/mui.min.js"></script>

<script>
	mui.init();

		//设置默认打开首页显示的子页序号；
		var Index = 0;
		//把子页的路径写在数组里面
		var subpages = ['NAV-Home.html', 'NAV-News.html', 'NAV-Phone.html', 'NAV-Myset.html'];

		//所有的plus-*方法写在mui.plusReady中或者后面。
		mui.plusReady(function() {
			//读取本地存储，检查是否为首次启动
			var showGuide = plus.storage.getItem("lauchFlag");
			//仅支持竖屏显示
			plus.screen.lockOrientation("portrait-primary");
			if(showGuide) {
				//有值，说明已经显示过了，无需显示；
				//关闭splash页面；
				plus.navigator.closeSplashscreen();
				plus.navigator.setFullscreen(false);
				//预加载
				//preload();

				//OpenSubView('APP/APP-Home.html')
				//IsLogin();
			} else {
				//显示启动导航
				mui.openWindow({
					id: 'guide',
					url: 'SYS-Guide.html',
					styles: {
						popGesture: "none"
					},
					show: {
						aniShow: 'none'
					},
					waiting: {
						autoShow: false
					}
				});
			};

			//获取当前页面所属的Webview窗口对象
			var self = plus.webview.currentWebview();
			for(var i = 0; i < 4; i++) {
				//创建webview子页
				var sub = plus.webview.create(
					subpages[i], //子页url
					subpages[i], //子页id
					{
						top: '0px', //设置距离顶部的距离
						bottom: '50px' //设置距离底部的距离
						
					}
				);
				//如不是我们设置的默认的子页则隐藏，否则添加到窗口中
				if(i != Index) {
					sub.hide();
				}
				//将webview对象填充到窗口
				self.append(sub);
			}

			//当前激活选项
			var activeTab = subpages[Index]
			var targetTab='';
				//title = document.querySelector(".mui-title");
			//选项卡点击事件
			mui('.mui-bar-tab').on('tap', 'a', function(e) {
				//获取目标子页的id
				 targetTab = this.getAttribute('href');
				if(targetTab == activeTab) {
					return;
				}
				//更换标题
				//title.innerHTML = this.querySelector('.mui-tab-label').innerHTML;
				//显示目标选项卡
				plus.webview.show(targetTab);
				//隐藏当前选项卡
				plus.webview.hide(activeTab);
				console.log('原有子窗口'+activeTab + '===>切换到'+ targetTab);
				//更改当前活跃的选项卡
				activeTab = targetTab;
				
			});
//			//自定义事件，模拟点击“首页选项卡”
//			document.addEventListener('gohome', function() {
//				var defaultTab = document.getElementById("defaultTab");
//				//模拟首页点击
//				mui.trigger(defaultTab, 'tap');
//				//切换选项卡高亮
//				var current = document.querySelector(".mui-bar-tab>.mui-tab-item.mui-active");
//				if(defaultTab !== current) {
//					current.classList.remove('mui-active');
//					defaultTab.classList.add('mui-active');
//				}
//			});
			//备份mui.back，mui.back已将窗口关闭逻辑封装的比较完善（预加载及父子窗口），因此最好复用mui.back
			var old_back = mui.back;
			mui.back = function() {
				if(activeTab != 'NAV-Home.html') {
					
					mui.toast('返回系统首页');
					var defaultTab = document.getElementById("defaultTab");
					plus.webview.show('NAV-Home.html');
					plus.webview.hide(targetTab);
					activeTab = 'NAV-Home.html';
					console.log('原有子窗口'+targetTab + '===>退回到'+ activeTab);
					var current = document.querySelector(".mui-bar-tab>.mui-tab-item.mui-active");
				if(defaultTab !== current) {
					current.classList.remove('mui-active');
					defaultTab.classList.add('mui-active');
				}
					//mui.fire(plus.webview.getLaunchWebview(), 'gohome', {})

					//
					//					//隐藏当前选项卡
					//					//plus.webview.hide(activeTab);
					//					//更改当前活跃的选项卡

					//					console.log(activeTab);
				} else {
					var btn = ["确定", "取消"];
					mui.confirm('确认退出[健康南县]应用系统？', '信息提示', btn, function(e) {
						if(e.index == 0) {
							//执行mui封装好的窗口关闭逻辑；
							//old_back();
							plus.runtime.quit();
						}
					});
				}

			}
		});
</script>

</html>